<template>
  <div class="app-container">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-search"
          size="mini"
          @click="handleSearch"
          >搜索</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['output:picking:add']"
          >新增</el-button
        >
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAddMul"
          v-hasPermi="['output:picking:addmul']"
        >
          批量领料
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          @click="handleUpdate"
          :disabled="type1"
          v-hasPermi="['output:picking:edit']"
        >
          修改
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="type1"
          @click="handleDelete"
          v-hasPermi="['output:picking:remove']"
        >
          删除
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-circle-check"
          size="mini"
          :disabled="type1"
          @click="handleSumit"
          v-hasPermi="['output:picking:submit']"
        >
          提交
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="handleDc('#exportDj', '生产领料单据')"
          v-hasPermi="['output:picking:export']"
        >
          EXCEL
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="handleDc('#exportMx', '生产领料明细')"
          v-hasPermi="['output:picking:export']"
        >
          领料明细
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="exportTotal"
          v-hasPermi="['output:picking:export']"
        >
          领料统计
        </el-button>
      </el-col>
      <Tag type="dot" size="default" color="#0fac09">提交</Tag>
      <Tag type="dot" size="default" color="#bb0331">通过</Tag>
      <Tag type="dot" size="default" color="#0323af">检验</Tag>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>

    <el-table
      @scrollBottom="load"
      highlight-current-row
      border
      stripe
      v-loading="loading"
      :data="pickingList"
      :height="tableH"
      @row-click="clickRow"
      id="exportDj"
      :cell-style="iCellStyle"
      :header-cell-style="{ 'text-align': 'center' }"
    >
      <el-table-column
        label="#"
        type="index"
        fixed="left"
        width="40"
        align="center"
      />
      <el-table-column
        label="领料单号"
        :show-overflow-tooltip="true"
        width="135"
        align="center"
        prop="clmDjbh"
      />
      <el-table-column
        label="领料日期"
        :show-overflow-tooltip="true"
        align="center"
        prop="clmLlrq"
        width="180"
      >
        <template #default="scope">
          <span>{{ parseTime(scope.row.clmLlrq, "{y}-{m}-{d}") }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="单据类型"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmType"
      >
        <template #default="scope">
          <dict-tag :options="clmTypeOptions" :value="scope.row.clmType" />
        </template>
      </el-table-column>
      <el-table-column
        label="仓库代码"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmCkdm"
      >
        <template #default="scope">
          <dict-tag :options="allStorageOptions" :value="scope.row.clmCkdm" />
        </template>
      </el-table-column>
      <el-table-column
        label="领料部门"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmBmdm"
      />
      <el-table-column
        label="单据描述"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmDesc"
      />
      <el-table-column
        label="建立人员"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmJlry"
      />
      <el-table-column
        label="撤回原因"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmNgdesc"
      />
      <el-table-column
        label="建立日期"
        :show-overflow-tooltip="true"
        align="center"
        prop="clmJlrq"
        width="180"
      >
        <template #default="scope">
          <span>{{
            parseTime(scope.row.clmJlrq, "{y}-{m}-{d} {h}:{i}:{s}")
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="审核人员"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmShry"
      />
      <el-table-column
        label="审核日期"
        :show-overflow-tooltip="true"
        align="center"
        prop="clmShrq"
        width="180"
      >
        <template #default="scope">
          <span>{{
            parseTime(scope.row.clmShrq, "{y}-{m}-{d} {h}:{i}:{s}")
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="过账人员"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmGzry"
      />
      <el-table-column
        label="过账日期"
        :show-overflow-tooltip="true"
        align="center"
        prop="clmGzrq"
        width="180"
      >
        <template #default="scope">
          <span>{{
            parseTime(scope.row.clmGzrq, "{y}-{m}-{d} {h}:{i}:{s}")
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="原因代码"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmYydm"
      >
        <template #default="scope">
          <dict-tag :options="clmYydmOptions" :value="scope.row.clmYydm" />
        </template>
      </el-table-column>
      <el-table-column
        label="原因描述"
        :show-overflow-tooltip="true"
        width="100"
        align="center"
        prop="clmYyms"
      />
      <el-table-column
        label="操作"
        align="center"
        width="130"
        fixed="right"
        class-name="small-padding fixed-width"
      >
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
            :disabled="scope.row.clmTjflag === '1'"
            v-show="scope.row.clmTjflag === '0'"
            @click="handleAdded(scope.row)"
            v-hasPermi="['output:picking:addCld']"
          >
            添加
          </el-button>
          <el-button
            size="mini"
            type="text"
            @click="handleDjDy(scope.row)"
            v-hasPermi="['output:pickingPost:clmPrint']"
            >单据打印</el-button
          >
          <el-button
            size="mini"
            type="text"
            @click="handleDjDy(scope.row, 2)"
            v-hasPermi="['output:pickingPost:clmPrint2']"
            >单据打印</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <!--明细-->
    <el-tabs v-model="activeTab">
      <el-tab-pane label="领料明细" name="first">
        <el-table
          border
          stripe
          :height="tableHChild"
          :data="chdDetList"
          id="exportMx"
          :header-cell-style="{ 'text-align': 'center' }"
        >
          <el-table-column label="#" type="index" align="center" fixed="left" />
          <el-table-column
            label="制造单号"
            align="center"
            prop="cldZzdh"
            fixed="left"
          />
          <el-table-column label="领料物料代码" align="center" prop="cldWldm" />
          <el-table-column label="申请数量" align="center" prop="cldSqsl" />
          <el-table-column
            label="单位"
            :show-overflow-tooltip="true"
            align="center"
            prop="itmDw"
          >
            <template #default="scope">
              <dict-tag :options="unitFlagOptions" :value="scope.row.itmDw" />
            </template>
          </el-table-column>
          <el-table-column
            label="存放位置"
            :show-overflow-tooltip="true"
            align="center"
            prop="cldCwdm"
          >
            <template #default="scope">
              <dict-tag :options="allCwOptions" :value="scope.row.cldCwdm" />
            </template>
          </el-table-column>
          <el-table-column
            label="制造车间"
            :show-overflow-tooltip="true"
            align="center"
            prop="cldCj"
          >
            <template #default="scope">
              <dict-tag :options="itCarOptions" :value="scope.row.cldCj" />
            </template>
          </el-table-column>
          <el-table-column label="出库数量" align="center" prop="cldCksl" />
          <el-table-column
            label="父项客户编码"
            align="center"
            prop="itmFxCustWldm"
          />
          <!-- <el-table-column label="出库人员" align="center" prop="cldCkry" />
          <el-table-column label="出库日期" align="center" prop="cldCkrq">
            <template #default="scope">
              <span>{{ parseTime(scope.row.cldCkrq, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
            </template>
          </el-table-column> -->
          <el-table-column label="规格描述" align="center" prop="itmPmgg" />
          <el-table-column
            label="客户物料编码"
            align="center"
            prop="itmCustWldm"
          />
          <el-table-column label="扫码日期" prop="cldSmrq">
            <template #default="scope">
              {{ $moment(scope.row.cldSmrq).format("YYYY-MM-DD HH:mm:ss") }}
            </template>
          </el-table-column>
          <el-table-column label="最小包装" align="center" prop="cldMinbz" />
          <el-table-column
            label="操作"
            align="center"
            class-name="small-padding fixed-width"
          >
            <template #default="scope">
              <el-button
                size="mini"
                type="text"
                :disabled="type1"
                @click="deleteChdDet(scope.row)"
                v-hasPermi="['output:picking:removeCld']"
              >
                删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="领料统计" name="second">
        <el-table
          border
          stripe
          id="exportTj"
          :height="tableHChild"
          :data="chdDetTotalList"
        >
          <el-table-column label="#" type="index" align="center" fixed="left" />
          <el-table-column
            label="客户代码"
            align="center"
            prop="itmCustWldm"
            fixed="left"
          />
          <el-table-column label="物料代码" align="center" prop="cldWldm" />
          <el-table-column
            label="品名规格"
            :show-overflow-tooltip="true"
            align="center"
            prop="itmPmgg"
          />
          <el-table-column
            label="单位"
            :show-overflow-tooltip="true"
            align="center"
            prop="itmDw"
          >
            <template #default="scope">
              <dict-tag :options="unitFlagOptions" :value="scope.row.itmDw" />
            </template>
          </el-table-column>
          <el-table-column label="存放位置" align="center" prop="cldCwdm">
            <template #default="scope">
              <dict-tag :options="allCwOptions" :value="scope.row.cldCwdm" />
            </template>
          </el-table-column>
          <el-table-column label="最小包装" align="center" prop="cldMinbz" />
          <el-table-column label="申请数量" align="center" prop="cldSqsl" />
          <el-table-column label="出库数量" align="center" prop="cldCksl" />
        </el-table>
      </el-tab-pane>
    </el-tabs>
    <!--    添加对话框-->
    <el-dialog
      v-model="openFull"
      :fullscreen="true"
      :close-on-click-modal="false"
      append-to-body
      class="dia-container"
    >
      <!-- 子项搜索条件框-->
      <el-form :model="queryChildParams" :inline="true">
        <el-row>
          <el-col :span="6">
            <el-form-item label="制造单号" prop="clmZzdh">
              <el-input
                v-model="queryChildParams.clmZzdh"
                placeholder="请输入制造单号"
                clearable
                size="small"
                @keyup.enter.native="serachChildrened"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="成品综合查询" prop="clmCpDesc">
              <el-input
                v-model="queryChildParams.clmCpDesc"
                placeholder="请输入成品信息"
                clearable
                size="small"
                @keyup.enter.native="serachChildrened"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="综合查询" prop="integratedQuery">
              <el-input
                v-model="queryChildParams.integratedQuery"
                placeholder="综合查询"
                clearable
                size="small"
                @keyup.enter.native="serachChildrened"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="车间" prop="clmCj">
              <el-radio-group v-model="queryChildParams.clmCj" size="medium">
                <el-radio
                  v-for="dict in itCarOptions"
                  :key="dict.dictValue"
                  :label="dict.dictValue"
                  :value="dict.dictValue"
                >
                  {{ dict.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item style="display: flex; justify-content: flex-end">
              <el-button type="primary" @click="serachChildrened"
                >查询</el-button
              >
            </el-form-item>
          </el-col>
          <el-col :span="12" style="text-align: right">
            <Tag type="dot" size="default" color="#d39207">代用料</Tag>
          </el-col>
        </el-row>
      </el-form>
      <!--子项数据框-->
      <!--      @row-click="clickdel"-->

      <el-table
        highlight-current-row
        v-loading="loading"
        :data="serachAddList"
        border
        stripe
        :height="tableHAdd"
        @row-click="tableAddClick"
        :row-class-name="({ row }) => (row.modDybz == 1 ? 'update' : '')"
        :header-cell-style="{ 'text-align': 'center' }"
      >
        <!-- <el-table-column label="#" width="50" type="index" align="center" /> -->
        <!-- <el-table-column type="selection" width="50" align="center" /> -->
        <el-table-column
          label="制造单号"
          width="135"
          :show-overflow-tooltip="true"
          align="center"
          prop="cldZzdh"
        />
        <el-table-column
          label="计划工单数量"
          width="100"
          :show-overflow-tooltip="true"
          align="center"
          prop="modDdsl"
        />
        <!-- <el-table-column label="车间" width="80" :show-overflow-tooltip="true" prop="clmCj" /> -->
        <el-table-column
          label="领料物料代码"
          width="135"
          :show-overflow-tooltip="true"
          prop="cldWldm"
        />
        <el-table-column
          label="父项物料代码"
          width="100"
          :show-overflow-tooltip="true"
          align="center"
          prop="cldFxdm"
        />

        <el-table-column
          label="采购属性"
          width="100"
          :show-overflow-tooltip="true"
          align="center"
          prop="modCgsx"
        >
          <template #default="scope">
            <dict-tag :options="bomCgsxOptions" :value="scope.row.modCgsx" />
          </template>
        </el-table-column>
        <el-table-column
          label="单位"
          width="80"
          :show-overflow-tooltip="true"
          align="center"
          prop="itmDw"
        >
          <template #default="scope">
            <dict-tag :options="unitFlagOptions" :value="scope.row.itmDw" />
          </template>
        </el-table-column>
        <el-table-column
          label="储位信息"
          min-width="120"
          :show-overflow-tooltip="true"
          prop="cldCwdm"
        >
          <template #default="scope">
            <dict-tag :options="allCwOptions" :value="scope.row.cldCwdm" />
          </template>
        </el-table-column>
        <el-table-column
          label="最小包装"
          width="100"
          :show-overflow-tooltip="true"
          align="center"
          prop="cldMinbz"
        />
        <el-table-column
          label="销售单号"
          width="135"
          :show-overflow-tooltip="true"
          align="center"
          prop="cldSodh"
        ></el-table-column>
        <el-table-column
          label="订单数量"
          width="80"
          :show-overflow-tooltip="true"
          align="center"
          prop="modTotalDdsl"
        />
        <el-table-column
          label="领料品名规格"
          min-width="250"
          fixed="right"
          :show-overflow-tooltip="true"
          prop="itmPmgg"
        />
        <el-table-column
          label="父项客户编码"
          min-width="100"
          fixed="right"
          :show-overflow-tooltip="true"
          prop="itmFxCustWldm"
        />
        <el-table-column
          label="父项品名规格"
          min-width="250"
          fixed="right"
          :show-overflow-tooltip="true"
          prop="itmFxPmgg"
        />
        <el-table-column
          label="总需求数量"
          width="90"
          fixed="right"
          :show-overflow-tooltip="true"
          align="center"
          prop="modXqsl"
        />
        <el-table-column
          label="工单需求数"
          width="90"
          fixed="right"
          :show-overflow-tooltip="true"
          align="center"
          prop="modLlsl"
        />
        <el-table-column
          label="已申请总数"
          width="90"
          fixed="right"
          :show-overflow-tooltip="true"
          align="center"
          prop="modYlsl"
        />
        <el-table-column
          label="待申请总数"
          v-if="typeChild != 'B'"
          width="100"
          fixed="right"
          :show-overflow-tooltip="true"
          align="center"
          prop="modDSqsl"
        />
        <el-table-column
          label="可用库存"
          width="75"
          fixed="right"
          :show-overflow-tooltip="true"
          align="center"
          prop="kcmKykc"
        />
        <el-table-column
          label="需申请数"
          width="80"
          fixed="right"
          align="center"
          prop="cldSqsl"
        >
          <template #default="scope">
            <el-input
              class="inputName"
              @input="
                (e) => {
                  changValue(scope.row, e);
                }
              "
              type="number"
              v-model="scope.row.cldSqsl"
            ></el-input>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        :page-size="queryChildParams.pageSize"
        :current-page.sync="queryChildParams.pageNum"
        @current-change="load2"
        layout="total, prev, pager, next,jumper"
        :total="total2"
        style="text-align: right"
      ></el-pagination>
      <!--明细-->
      <el-tabs v-model="activeTab">
        <el-tab-pane label="领料明细" name="first">
          <el-table
            border
            stripe
            :height="tableHAddChild"
            :data="chdDetList"
            :header-cell-style="{ 'text-align': 'center' }"
          >
            <el-table-column
              label="#"
              type="index"
              align="center"
              fixed="left"
            />
            <el-table-column
              label="制造单号"
              align="center"
              prop="cldZzdh"
              fixed="left"
            />
            <el-table-column
              label="领料物料代码"
              align="center"
              prop="cldWldm"
            />
            <el-table-column label="申请数量" align="center" prop="cldSqsl" />
            <el-table-column
              label="单位"
              :show-overflow-tooltip="true"
              align="center"
              prop="itmDw"
            >
              <template #default="scope">
                <dict-tag :options="unitFlagOptions" :value="scope.row.itmDw" />
              </template>
            </el-table-column>
            <el-table-column
              label="存放位置"
              :show-overflow-tooltip="true"
              align="center"
              prop="cldCwdm"
            >
              <template #default="scope">
                <dict-tag :options="allCwOptions" :value="scope.row.cldCwdm" />
              </template>
            </el-table-column>
            <el-table-column label="出库数量" align="center" prop="cldCksl" />
            <el-table-column
              label="父项客户编码"
              align="center"
              prop="itmFxCustWldm"
            />
            <!-- <el-table-column label="出库人员" align="center" prop="cldCkry" />
            <el-table-column label="出库日期" align="center" prop="cldCkrq">
              <template #default="scope">
                <span>{{ parseTime(scope.row.cldCkrq, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
              </template>
            </el-table-column> -->
            <el-table-column label="规格描述" align="center" prop="itmPmgg" />
            <el-table-column
              label="客户物料编码"
              align="center"
              prop="itmCustWldm"
            />
            <el-table-column label="最小包装" align="center" prop="cldMinbz" />
            <el-table-column
              label="操作"
              align="center"
              class-name="small-padding fixed-width"
            >
              <template #default="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="deleteChdDet(scope.row)"
                  v-hasPermi="['output:picking:removeCld']"
                >
                  删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="领料统计" name="second">
          <el-table
            border
            stripe
            :height="tableHAddChild"
            :data="chdDetTotalList"
          >
            <el-table-column
              label="#"
              type="index"
              align="center"
              fixed="left"
            />
            <el-table-column
              label="客户代码"
              align="center"
              prop="itmCustWldm"
              fixed="left"
            />
            <el-table-column label="物料代码" align="center" prop="cldWldm" />
            <el-table-column
              label="品名规格"
              align="center"
              :show-overflow-tooltip="true"
              prop="itmPmgg"
            />
            <el-table-column
              label="单位"
              :show-overflow-tooltip="true"
              align="center"
              prop="itmDw"
            >
              <template #default="scope">
                <dict-tag :options="unitFlagOptions" :value="scope.row.itmDw" />
              </template>
            </el-table-column>
            <el-table-column label="存放位置" align="center" prop="itmCwdm" />
            <el-table-column label="最小包装" align="center" prop="cldMinbz" />
            <el-table-column label="申请数量" align="center" prop="cldSqsl" />
            <el-table-column label="出库数量" align="center" prop="cldCksl" />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="产品领用Bom" name="three">
          <ListProductBom
            :cldZzdh="cldZzdh"
            :itmCkdm="queryChildParams.clmCkdm"
          ></ListProductBom>
        </el-tab-pane>
      </el-tabs>
      <div style="margin-top: 25px; display: flex; justify-content: flex-end">
        <el-button @click="cancel">取消</el-button>
        <el-button
          type="primary"
          @click="handAddChildren"
          :loading="loadingButton"
          >确认</el-button
        >
      </div>
    </el-dialog>
    <!--    添加对话框-->
    <el-dialog
      v-model="openFullFei"
      :fullscreen="true"
      :close-on-click-modal="false"
      append-to-body
    >
      <!-- 子项搜索条件框-->
      <el-form :model="queryChildParams" :inline="true">
        <el-row>
          <el-col :span="20">
            <el-form-item label="综合查询" prop="integratedQuery">
              <el-input
                v-model="queryChildParams.integratedQuery"
                placeholder="综合查询"
                clearable
                size="small"
                @keyup.enter.native="serachChildrened"
              />
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item style="display: flex; justify-content: flex-end">
              <el-button type="primary" @click="serachChildrened"
                >查询</el-button
              >
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <!--子项数据框-->
      <!--      @row-click="clickdel"-->
      <el-table
        highlight-current-row
        v-loading="loading"
        :data="serachAddList"
        border
        stripe
        :height="tableHAdd"
        @scrollBottom="load2"
        :header-cell-style="{ 'text-align': 'center' }"
      >
        <el-table-column label="#" min-width="50" type="index" align="center" />
        <el-table-column type="selection" min-width="50" align="center" />
        <el-table-column
          label="物料代码"
          min-width="135"
          align="center"
          :show-overflow-tooltip="true"
          prop="cldWldm"
        />
        <el-table-column
          label="品名规格"
          min-width="400"
          :show-overflow-tooltip="true"
          prop="itmPmgg"
        />
        <el-table-column
          label="单位"
          min-width="80"
          :show-overflow-tooltip="true"
          align="center"
          prop="itmDw"
        >
          <template #default="scope">
            <dict-tag :options="unitFlagOptions" :value="scope.row.itmDw" />
          </template>
        </el-table-column>
        <el-table-column
          label="储位信息"
          min-width="120"
          :show-overflow-tooltip="true"
          align="center"
          prop="cldCwdm"
        >
          <template #default="scope">
            <dict-tag :options="allCwOptions" :value="scope.row.cldCwdm" />
          </template>
        </el-table-column>
        <el-table-column
          label="最小包装"
          min-width="100"
          :show-overflow-tooltip="true"
          align="center"
          prop="cldMinbz"
        />
        <el-table-column
          label="已申请数"
          min-width="100"
          :show-overflow-tooltip="true"
          align="center"
          prop="modYlsl"
        />
        <el-table-column
          label="可用库存"
          min-width="80"
          :show-overflow-tooltip="true"
          align="center"
          prop="kcmKykc"
        />
        <el-table-column
          label="制造车间"
          min-width="80"
          :show-overflow-tooltip="true"
          align="center"
          prop="cldCj"
        >
          <template v-slot="scope">
            <el-select
              size="mini"
              style="width: 120px"
              v-model="scope.row.cldCj"
              placeholder="请选择车间"
            >
              <el-option
                v-for="item in itCarOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              />
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          label="需申请数"
          min-width="100"
          align="center"
          prop="cldSqsl"
        >
          <template #default="scope">
            <el-input
              class="inputName"
              @input="
                (e) => {
                  changValue(scope.row, e);
                }
              "
              type="number"
              v-model="scope.row.cldSqsl"
            ></el-input>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        :page-size="queryChildParams.pageSize"
        :current-page.sync="queryChildParams.pageNum"
        @current-change="load2"
        layout="total, prev, pager, next"
        :total="total2"
        style="text-align: right"
      ></el-pagination>
      <div style="margin-top: 25px; display: flex; justify-content: flex-end">
        <el-button @click="cancel">取消</el-button>
        <el-button
          type="primary"
          @click="handAddChildren"
          :loading="loadingButton"
          >确认</el-button
        >
      </div>
    </el-dialog>
    <!-- 查询对话框   -->
    <el-dialog
      :title="title"
      v-model="openSearch"
      :close-on-click-modal="false"
      draggable
      width="450px"
      append-to-body
    >
      <el-form
        :model="queryParams"
        ref="queryForm"
        :inline="true"
        v-show="showSearch"
        label-width="88px"
      >
        <el-col :span="24">
          <el-form-item label="领料日期">
            <el-date-picker
              v-model="daterangeClmLlrq"
              size="small"
              style="width: 240px"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="daterange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :picker-options="pickerOptions"
              :default-time="['00:00:00', '23:59:59']"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="领料单号" prop="clmDjbh">
            <el-input
              v-model="queryParams.clmDjbh"
              placeholder="请输入领料单号"
              clearable
              style="width: 240px"
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="制造单号" prop="cldZzdh">
            <el-input
              v-model="queryParams.cldZzdh"
              placeholder="请输入制造单号"
              clearable
              style="width: 240px"
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="品名规格" prop="clmPmgg">
            <el-input
              v-model="queryParams.clmPmgg"
              placeholder="请输入品名规格"
              clearable
              style="width: 240px"
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="仓库" prop="clmCkdms">
            <el-select
              size="small"
              style="width: 240px"
              v-model="queryParams.clmCkdms"
              multiple
              clearable
              placeholder="请选择仓库"
            >
              <el-option
                v-for="item in storageOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24" style="text-align: center">
          <el-form-item>
            <el-radio-group v-model="queryParams.clmZtbz">
              <el-radio
                v-for="dict in cjmZtbzOptions"
                :key="dict.dictValue"
                :label="dict.dictValue"
                >{{ dict.dictLabel }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            style="margin-top: 25px; display: flex; justify-content: flex-end"
          >
            <el-button @click="cancel">取消</el-button>
            <el-button type="primary" @click="handleQuery">确认</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-dialog>
    <!-- 添加或修改出库领料开单作业对话框 -->
    <el-dialog
      :title="title"
      v-model="open"
      :close-on-click-modal="false"
      draggable
      width="700px"
      append-to-body
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-col :span="12">
          <el-form-item label="领料单号" prop="clmDjbh">
            <el-input style="width: 240px" v-model="form.clmDjbh" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="开单日期" prop="clmLlrq">
            <el-date-picker
              clearable
              size="small"
              v-model="form.clmLlrq"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择领料日期"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="领料类型" prop="clmType">
            <el-select
              v-model="form.clmType"
              :disabled="
                chdDetList.length > 0 && this.title.indexOf('修改') > -1
              "
              style="width: 240px"
              placeholder="请选择单据类型"
            >
              <el-option
                v-for="dict in clmTypeOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="仓库代码" prop="clmCkdm">
            <el-select
              v-model="form.clmCkdm"
              placeholder="请选择单据类型"
              :disabled="
                chdDetList.length > 0 && this.title.indexOf('修改') > -1
              "
            >
              <el-option
                v-for="dict in storageOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="单据描述" prop="clmDesc">
            <el-input
              style="width: 240px"
              v-model="form.clmDesc"
              placeholder="请输入单据描述"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="原因代码" prop="clmYydm">
            <el-select
              v-model="form.clmYydm"
              placeholder="请选择原因代码"
              @change="changeDescriptionFlag"
              clearable
            >
              <el-option
                v-for="dict in clmYydmOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="原因描述" prop="clmYyms">
            <el-input
              v-model="form.clmYyms"
              type="textarea"
              placeholder="请输入内容"
              :disabled="reasonDescriptionFlag"
            />
          </el-form-item>
        </el-col>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="submitForm" :loading="loadingButton"
          >确 定</el-button
        >
      </div>
    </el-dialog>
    <!-- 批量添加 -->
    <el-dialog
      :title="tableDataChild.title"
      v-model="tableDataChild.open"
      :close-on-click-modal="false"
      fullscreen
      append-to-body
    >
      <div style="margin-left: 20px">
        <Tag type="dot" size="default" color="#d39207">代用料</Tag>
        <Tag type="dot" size="default" color="#3403bb">多仓</Tag>
        <Tag type="dot" size="default" color="#f5222d">可用库存不足</Tag>
      </div>
      <div style="height: calc(100vh - 150px); overflow: auto">
        <el-card
          v-for="(item, index) in formMul"
          :key="index"
          style="margin: 20px"
          shadow="hover"
          title=""
        >
          <div>
            <el-form :model="item" :inline="true">
              <el-row>
                <el-col :span="8">
                  <el-form-item label="成品编号" prop="clmCpDesc">
                    <HdSearchInput
                      v-model="item.clmCpDesc"
                      keyName="itmCustwldm"
                      modulePath="project/bom"
                      placeholder="请输入成品编码"
                      @change="
                        (value) => {
                          serachChildrenedMul(item);
                        }
                      "
                    ></HdSearchInput>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="数量" prop="number">
                    <el-input
                      v-model="item.number"
                      placeholder="请输入领料数量"
                      clearable
                      size="small"
                      @change="serachChildrenedMul(item)"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="8" style="text-align: right">
                  <el-button type="warning" size="mini" @click="delMul(index)"
                    >删除</el-button
                  >
                </el-col>
              </el-row>
            </el-form>
            <u-table
              v-loading="tableDataChild.loading"
              highlight-current-row
              border
              stripe
              ref="somCheckTable"
              showBodyOverflow="title"
              showHeaderOverflow="title"
              big-data-checkbox
              :row-class-name="
                ({ row }) => {
                  if (row.modDybz == 1) {
                    return 'update';
                  }
                  if (
                    item.children.filter((item) => item.cldWldm == row.cldWldm)
                      .length > 1
                  ) {
                    return 'check';
                  }
                }
              "
              :cell-style="
                ({ row, column, rowIndex, columnIndex }) => {
                  if (
                    column.property == 'kcmKykc' &&
                    row.kcmKykc < row.modXqsl
                  ) {
                    return { color: 'red' };
                  }
                }
              "
              :data="item.children"
              :header-cell-style="{ 'text-align': 'center' }"
            >
              <u-table-column
                label="#"
                min-width="50"
                type="index"
                align="center"
              />
              <!-- <u-table-column type="selection" min-width="50" align="center" /> -->
              <u-table-column
                label="物料代码"
                min-width="135"
                align="center"
                :show-overflow-tooltip="true"
                prop="cldWldm"
              />
              <u-table-column
                label="品名规格"
                min-width="400"
                :show-overflow-tooltip="true"
                prop="itmPmgg"
              />
              <u-table-column
                label="单位"
                min-width="80"
                :show-overflow-tooltip="true"
                align="center"
                prop="itmDw"
              >
                <template #default="scope">
                  <dict-tag
                    :options="unitFlagOptions"
                    :value="scope.row.itmDw"
                  />
                </template>
              </u-table-column>
              <u-table-column
                label="仓库"
                min-width="120"
                :show-overflow-tooltip="true"
                align="center"
                prop="cldCwdm"
              >
                <template #default="scope">
                  {{
                    getDictLabel(
                      scope.row.cldCwdm,
                      allCwOptions,
                      "dictValue",
                      "storageName"
                    )
                  }}
                </template>
              </u-table-column>
              <u-table-column
                label="最小包装"
                width="80"
                :show-overflow-tooltip="true"
                align="center"
                prop="cldMinbz"
              />
              <u-table-column
                label="总订单数"
                width="100"
                :show-overflow-tooltip="true"
                align="center"
                prop="modDdsl"
              />
              <u-table-column
                label="工单需求数"
                width="100"
                :show-overflow-tooltip="true"
                align="center"
                prop="modXqsl"
              />
              <u-table-column
                label="已申请总数"
                width="100"
                :show-overflow-tooltip="true"
                align="center"
                prop="modYlsl"
              />
              <u-table-column
                label="待申请总数"
                width="100"
                :show-overflow-tooltip="true"
                align="center"
                prop="modDLlsl"
              />
              <u-table-column
                label="可用库存"
                width="100"
                :show-overflow-tooltip="true"
                align="center"
                prop="kcmKykc"
              />
              <u-table-column
                label="需领料数"
                width="100"
                :show-overflow-tooltip="true"
                align="center"
                prop="number"
              />
              <u-table-column
                label="申请数量"
                min-width="100"
                align="center"
                prop="cldSqsl"
              >
                <template #default="scope">
                  <el-input
                    class="inputName"
                    @input="
                      (e) => {
                        changValueMul(scope.row, e);
                        updateKykc();
                      }
                    "
                    type="number"
                    v-model="scope.row.cldSqsl"
                  ></el-input>
                </template>
              </u-table-column>
            </u-table>
          </div>
        </el-card>
      </div>

      <div slot="footer" class="dialog-footer">
        <el-button @click="addMul">新增成品</el-button>
        <el-button @click="tableDataChild.open = false">取 消</el-button>
        <el-button type="primary" @click="submitFormChild">确 定</el-button>
      </div>
    </el-dialog>
    <!--    需要打印的东西-->
    <hd-print-page class="printPage" ref="printPage">
      <div class="content2" v-for="page in pageData">
        <div
          style="
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            height: 100%;
          "
        >
          <table class="noborder">
            <colgroup>
              <col style="width: 35mm" />
              <col style="width: 35mm" />
              <col style="width: 30mm" />
              <col style="width: 30mm" />
              <col style="width: 25mm" />
              <col style="width: 12mm" />
              <col style="width: 18mm" />
              <col style="width: 18mm" />
            </colgroup>
            <thead>
              <tr>
                <th colspan="8" class="noborder" style="height: 12mm">
                  <h1 style="position: relative">
                    {{
                      $store.state.settings.sysName.slice(0, 2)
                    }}市衡德实业有限公司生产领料单
                    <!-- <span style="text-align: right; right: 0px; position: absolute; font-size: 11pt">
                      打印次数 ({{ rowData.rwmDyflag || 1 }})
                    </span> -->
                  </h1>
                  <hr style="border: 0; border-top: 4px double #000" />
                </th>
              </tr>
              <tr>
                <th>源单类型:</th>
                <th class="nowrap">
                  <dict-tag
                    :options="clmTypeOptions"
                    :value="rowData.clmType"
                  />
                </th>
                <th rowspan="2">
                  {{ $moment(rowData.clmLlrq).format("YYYY-MM-DD") }}
                </th>
                <th rowspan="2"></th>
                <th colspan="1">编号:</th>
                <th colspan="3">{{ rowData.clmDjbh }}</th>
              </tr>
              <tr>
                <th>领料仓库:</th>
                <th>
                  <dict-tag
                    :options="allStorageOptions"
                    :value="rowData.clmCkdm"
                  />
                </th>
                <th colspan="1">开单人员:</th>
                <th colspan="3">{{ rowData.clmJlry }}</th>
              </tr>
              <tr>
                <th>客户编号</th>
                <th>物料代码</th>
                <th colspan="2">规格描述</th>
                <th>仓位</th>
                <th>单位</th>
                <th>申请数量</th>
                <th>实际数量</th>
              </tr>
            </thead>
            <tbody>
              <tr v-for="(item, idx) in page">
                <td>
                  <div class="nowrap">{{ item.itmCustWldm }}</div>
                </td>
                <td>{{ item.cldWldm }}</td>
                <td colspan="2">
                  <div class="nowrap">{{ item.itmPmgg }}</div>
                </td>
                <td>
                  <dict-tag :options="allCwOptions" :value="item.cldCwdm" />
                </td>
                <td>
                  <dict-tag :options="unitFlagOptions" :value="item.itmDw" />
                </td>
                <td>{{ item.cldSqsl }}</td>
                <td>&emsp;</td>
              </tr>
            </tbody>
          </table>
          <!-- <div style="width: 5mm; flex: 0 0 5mm"></div> -->
          <div
            style="
              display: flex;
              justify-content: space-between;
              padding: 3mm 20mm 3mm 3mm;
              width: 20cm;
            "
          >
            <span>审核:</span>
            <span>验收:</span>
            <span>保管:</span>
            <span>制单：</span>
          </div>
        </div>
        <div
          style="writing-mode: vertical-lr; flex: 1 1 auto; padding-right: 30mm"
        ></div>
      </div>
    </hd-print-page>
  </div>
</template>

<script>
import {
  addPicking,
  ckSumitChild,
  delCkMxDet,
  delPicking,
  exportPickingTotal,
  getPicking,
  listckMxDet,
  listPicking,
  searchCk,
  submitCkMx,
  updatePicking,
  getNeedCld,
  saveBatchClm,
} from "@/api/output/picking";
import { getAll, getstorageType } from "@/api/repertory/Storage";
import { getAllCgList } from "@/api/project/mstr";
import XLSX from "xlsx";
import { exportTable, printOrder, splitArray } from "@/utils/ruoyi";
import ListProductBom from "./ListProductBom.vue";

export default {
  name: "Picking",
  components: { ListProductBom },
  data() {
    return {
      // 遮罩层
      loading: true,
      openFull: false,
      openFullFei: false,
      // 导出遮罩层
      exportLoading: false,
      // 选中数组
      ids: [],
      // 显示搜索条件
      showSearch: true,
      openSearch: false,
      // 总条数
      total: 0,
      total2: 0,
      // 出库领料开单作业表格数据
      pickingList: [],
      chdDetList: [],
      chdDetTotalList: [],
      cldZzdh: "",
      serachAddList: [],
      tableH: 250,
      tableHChild: 300,
      tableHAdd: 230,
      tableHAddChild: 200,
      activeTab: "first",
      //所有仓库
      allStorageOptions: [],
      //有效仓库
      storageOptions: [],
      rowdata: [],
      //当前数据
      rowData: null,
      typeChild: null,
      //选择标识
      type1: true,
      //原因描述flag
      reasonDescriptionFlag: true,
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,

      // 单据类型字典
      clmTypeOptions: [],
      // 原因代码字典
      clmYydmOptions: [],
      itCarOptions: [],
      // 领料日期时间范围
      daterangeClmLlrq: [
        this.$moment().startOf("month").toDate(),
        this.$moment().endOf("month").toDate(),
      ],
      unitFlagOptions: [],
      bomCgsxOptions: [],
      allCwOptions: [],
      cjmZtbzOptions: [],
      //日期初始化
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 25,
        clmDjbh: null,
        cldZzdh: null,
        clmLlrq: null,
        clmCkdms: [],
        clmPmgg: null,
        clmZtbz: "1",
      },
      // 添加物料-查询参数
      queryChildParams: {
        pageNum: 1,
        pageSize: 8,
        clmZzdh: null,
        clmCpDesc: null,
        clmCj: "mp_000",
        integratedQuery: null,
        clmDjbh: null,
        clmCkdm: null,
        clmType: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        clmType: [
          { required: true, message: "单据类型不能为空", trigger: "change" },
        ],
        clmCkdm: [
          { required: true, message: "仓库代码不能为空", trigger: "blur" },
        ],
      },
      pageData: [],
      loadingChild: false,
      loadingButton: false,
      tableDataChild: {
        rows: [],
        title: "批量领料",
        loading: false,
        total: 0,
        open: false,
        selection: [],
        rules: {
          // processNo: [{ required: true, message: '请输入序号', trigger: 'blur' }],
          // processMouldCode: [{ required: true, message: '请选择模具', trigger: 'blur' }],
        },
        queryParams: {
          pageNum: 1,
          pageSize: 9999,
        },
      },
      formMul: [
        {
          clmCpDesc: "",
          number: 0,
          children: [],
        },
      ],
    };
  },
  created() {
    this.getList();
    //制造车间字典
    //单位
    this.getAllDicts("sys_unit").then((response) => {
      this.unitFlagOptions = response.data;
    });
    this.getDicts("sys_cjm_ztbz").then((response) => {
      this.cjmZtbzOptions = response.data;
    });
    //得到采购属性
    getAllCgList().then((response) => {
      this.bomCgsxOptions = response.data;
      for (let i of this.bomCgsxOptions) {
        i.dictLabel = i.cgName;
        i.dictValue = i.cgId + "";
        i.listClass = "default";
      }
    });
    this.getDicts("Manufacturing_plant").then((response) => {
      this.itCarOptions = response.data;
      if (this.$store.state.settings.sysName.indexOf("荆州") > -1) {
        this.itCarOptions = this.itCarOptions.filter((o) => {
          return o.dictLabel !== "所有";
        });
        this.queryChildParams.clmCj = "mp_004";
      }
    });
    this.getDicts("production_pick_type").then((response) => {
      this.clmTypeOptions = response.data;
      if (!this.$hasPermi(["output:picking:noplan"])) {
        this.clmTypeOptions = this.clmTypeOptions.filter(
          (o) => o.dictValue != "C"
        );
      }
    });
    this.getDicts("reason_category").then((response) => {
      this.clmYydmOptions = response.data;
    });
    //所有仓库
    getAll().then((response) => {
      this.allStorageOptions = response.data;

      for (let item of this.allStorageOptions) {
        item.dictLabel = item.storageName;
        item.listClass = "default";
        item.dictValue = item.storageId + "";
      }
    });

    //所有储位
    getAll().then((response) => {
      this.allCwOptions = response.data;

      for (let item2 of this.allCwOptions) {
        item2.dictLabel = item2.storageDefaultstorage;
        item2.listClass = "default";
        item2.dictValue = item2.storageId + "";
      }
    });
    //有效仓库
    getstorageType("0").then((response) => {
      this.storageOptions = response.data;

      for (let item of this.storageOptions) {
        item.dictLabel = item.storageName;
        item.listClass = "default";
        item.dictValue = item.storageId + "";
      }
    });
  },
  methods: {
    /** 查询出库领料开单作业列表 */
    getList(row) {
      this.loading = true;
      this.queryParams.params = {};
      if (null != this.daterangeClmLlrq && "" != this.daterangeClmLlrq) {
        this.queryParams.params["beginClmLlrq"] = this.moment(
          this.daterangeClmLlrq[0]
        ).format("YYYY-MM-DD HH:mm:ss");
        this.queryParams.params["endClmLlrq"] = this.moment(
          this.daterangeClmLlrq[1]
        ).format("YYYY-MM-DD HH:mm:ss");
      }
      this.queryParams.pageNum = 1;
      listPicking(this.queryParams).then((response) => {
        this.pickingList = [];
        this.pickingList = this.pickingList.concat(response.rows);
        this.total = response.total;
        this.loading = false;
        if (row != null) {
          this.clickRow(row);
        } else if (this.pickingList != null && this.pickingList.length > 0) {
          this.clickRow(this.pickingList[0]);
        } else {
          this.chdDetTotalList = [];
          this.chdDetList = [];
        }
      });
    },
    handleAdded(row) {
      this.typeChild = row.clmType;
      if (row.clmType === "C") {
        this.openFullFei = true;
      } else {
        this.openFull = true;
      }
      this.queryChildParams.clmDjbh = row.clmDjbh;
      this.queryChildParams.clmCkdm = row.clmCkdm;
      this.queryChildParams.clmType = row.clmType;

      this.serachChildrened();
    },
    //load
    load() {
      if (
        this.queryParams.pageNum <
        Math.ceil(this.total / this.queryParams.pageSize)
      ) {
        this.queryParams.pageNum++;
        listPicking(this.queryParams).then((response) => {
          this.pickingList = this.pickingList.concat(response.rows);
          this.total = response.total;
          this.loading = false;
        });
      }
      return 0;
    },
    load2() {
      //if (this.queryChildParams.pageNum < Math.ceil(this.total2 / this.queryChildParams.pageSize)) {
      // this.queryChildParams.pageNum++
      searchCk(this.queryChildParams).then((response) => {
        this.serachAddList = response.rows;
        this.total2 = response.total;
        this.loading = false;
      });
      //}
      return 0;
    },
    serachChildrened() {
      this.queryChildParams.pageNum = 1;
      searchCk(this.queryChildParams).then((res) => {
        this.serachAddList = [];
        this.serachAddList = this.serachAddList.concat(res.rows);
        this.total2 = res.total;
      });
    },
    serachChildrenedMul(item) {
      if (
        this.formMul.filter((o) => o.clmCpDesc === item.clmCpDesc).length > 1
      ) {
        this.msgError("请勿重复添加!");
        this.$nextTick(() => {
          item.clmCpDesc = "";
        });
        return;
      }
      getNeedCld({ clmCpDesc: item.clmCpDesc, number: item.number }).then(
        (res) => {
          item.children = res.data;
          this.updateKykc();
        }
      );
    },
    updateKykc() {
      const pre = new Map();
      this.formMul.forEach((cur) => {
        cur.children.forEach((item) => {
          const k = item.cldWldm + "#" + item.cldCwdm;
          if (pre.has(k)) {
            item.kcmKykc = pre.get(k);
          }
          pre.set(k, this.$math.sub(item.kcmKykc, item.cldSqsl).toNumber());
        });
      });
    },
    submitFormChild() {
      saveBatchClm(this.formMul).then((response) => {
        this.msgSuccess("添加成功~");
        this.tableDataChild.open = false;
        this.getList();
        this.formMul = [
          {
            clmCpDesc: "",
            number: 0,
            children: [],
          },
        ];
      });
    },
    handAddChildren() {
      const tmpData = this.serachAddList.filter((a) => {
        return !!a.cldSqsl && a.cldSqsl > 0;
      });
      if (!tmpData.length > 0) {
        this.msgError("请输入需要添加的物料~");
        return;
      }
      this.loadingButton = true;
      ckSumitChild(tmpData)
        .then((response) => {
          this.msgSuccess("添加成功~");
          this.serachAddList = [];
          //this.serachChildrened()
          this.load2();
          this.getChdDetList(this.queryChildParams.clmDjbh);
          this.loadingButton = false;
        })
        .catch(() => {
          this.load2();
          this.getChdDetList(this.queryChildParams.clmDjbh);
          this.msgError("添加失败~");
          this.loadingButton = false;
        });
    },
    /** 删除子项明细操作 */
    deleteChdDet(row) {
      delCkMxDet(row.cldId)
        .then((res) => {
          this.msgSuccess("删除成功~");
          this.getChdDetList(row.cldDjbh);
          //this.serachChildrened()
        })
        .catch(() => {
          this.msgError("删除失败~");
        });
    },

    getChdDetList(chdDjbh) {
      this.loadingChild = true;
      listckMxDet(chdDjbh).then((response) => {
        this.chdDetTotalList = response.data.list2;
        this.chdDetList = response.data.list1;
        this.loadingChild = false;
      });
    },
    tableAddClick(row) {
      this.cldZzdh = row.cldZzdh;
      // getProductMod(row.cldZzdh).then((response) => {
      //   this.listProductBom = response.data
      // })
    },
    changValue(row, e) {
      //计划
      let cldSqsl = parseFloat(row.cldSqsl);
      if (this.typeChild == "A") {
        const max = Math.min(row.modDSqsl, row.kcmKykc);
        if (cldSqsl > max) {
          this.msgError("可用库存不足~");
          row.cldSqsl = max;
          e = row.cldSqsl;
          return;
        }
      } else if (this.typeChild == "B") {
        if (cldSqsl > row.kcmKykc) {
          this.msgError("可用库存不足~");
          row.cldSqsl = row.kcmKykc;
          e = row.cldSqsl;
          return;
        }
      }
      //非计划
      if (this.openFullFei) {
        if (cldSqsl > row.kcmKykc) {
          this.msgError("可用库存不足~");
          row.cldSqsl = row.kcmKykc;
          e = row.cldSqsl;
          return;
        }
      }
      // 同一物料申请的总数据不能超过可用库存
      const list = this.serachAddList.filter((a) => a.cldWldm === row.cldWldm);
      const count = list.reduce((p, c) => p + parseInt(c.cldSqsl || 0), 0);
      if (row.kcmKykc < count) {
        this.msgError("同一物料申请的总数据不能超过可用库存.");
        let numKy = parseInt(row.kcmKykc - (count - e));
        row.cldSqsl = numKy;
        e = row.cldSqsl;
        return;
      }
    },
    iCellStyle: function ({ row, column, rowIndex, columnIndex }) {
      //提交
      if (row.clmZtbz == "1" && row.clmTjflag == "1") {
        return "color:#0fac09";
      }
      //通过
      else if (row.clmZtbz == "2" && row.clmTjflag == "1") {
        return "color:#0323af";
      }
      //检验
      else if (row.clmZtbz == "6" && row.clmTjflag == "1") {
        return "color:#bb0331";
      }
    },
    clickRow(row) {
      // //获得选中的详细数据
      this.rowData = row;
      // //获得当前单据的状态
      // this.ids = row.rwmId
      this.type1 = !(row != null && row.clmZtbz == "1" && row.clmTjflag == "0");
      //获得选中的详细数据
      this.getChdDetList(row.clmDjbh);
    },
    // getCldDetList(data) {
    //
    // },
    // 取消按钮
    cancel() {
      this.open = false;
      this.openSearch = false;
      this.openFull = false;
      this.openFullFei = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        clmId: null,
        clmDjbh: null,
        clmType: null,
        clmCkdm: null,
        clmBmdm: null,
        clmDesc: null,
        clmTjflag: null,
        clmNgdesc: null,
        clmZtbz: null,
        clmJlry: null,
        clmJlrq: null,
        clmShry: null,
        clmShrq: null,
        clmGzry: null,
        clmGzrq: null,
        clmYydm: null,
        clmYyms: null,
        clmLlrq: this.moment().format("YYYY-MM-DD"),
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.pickingList = [];
      this.getList();
      this.openSearch = false;
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.daterangeClmLlrq = [];
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.clmId);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加出库领料开单作业";
    },
    handleAddMul() {
      this.tableDataChild.open = true;
      this.formMul = [
        {
          clmCpDesc: "",
          number: 0,
          children: [],
        },
      ];
    },
    addMul() {
      this.formMul.push({
        clmCpDesc: "",
        number: 0,
        children: [],
      });
    },
    delMul(idx) {
      this.formMul.splice(idx, 1);
    },
    changValueMul(row, e) {
      //计划
      let cldSqsl = parseFloat(row.cldSqsl);

      const max = Math.min(row.modDLlsl, row.kcmKykc);
      if (cldSqsl > max) {
        this.msgError("可用库存不足~");
        row.cldSqsl = max;
        e = row.cldSqsl;
        return;
      }
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const clmId = row.clmId || this.rowData.clmId;
      getPicking(clmId).then((response) => {
        this.form = response.data;
        this.open = true;
        this.title = "修改出库领料开单作业";
      });
    },
    handleSearch() {
      this.reset();
      this.title = "查询出库领料开单作业";
      this.openSearch = true;
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          this.loadingButton = true;
          this.form.clmBmdm = this.$store.state.user.deptName;
          this.form.clmLlrq = this.moment(this.form.clmLlrq).format();
          console.log(
            this.form.clmType == "C" &&
              !(this.form.clmYyms == null || this.form.clmYyms == null)
          );

          if (
            this.form.clmType == "C" &&
            (this.form.clmYydm == null ||
              this.form.clmYydm === "" ||
              this.form.clmYyms == null ||
              this.form.clmYyms === "")
          ) {
            this.msgError("领料类型为非计划领料时，原因代码和原因描述必填");
            this.loadingButton = false;
            return;
          }
          if (this.form.clmId != null) {
            updatePicking(this.form).then((response) => {
              this.msgSuccess("修改成功");
              this.open = false;
              this.getList();
              this.loadingButton = false;
            });
          } else {
            addPicking(this.form).then((response) => {
              this.msgSuccess("新增成功");
              this.open = false;
              this.loadingButton = false;
              this.getList();
            });
          }
        }
      });
    },
    handleDc(a, b) {
      exportTable(a, b);
    },
    exportTotal() {
      const order = this.rowData.clmDjbh;
      this.$confirm("是否确认导出该领料统计?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.exportLoading = true;
          return exportPickingTotal(order);
        })
        .then((response) => {
          this.download(response.msg);
          this.exportLoading = false;
        })
        .catch(() => {});
    },
    /** 提交按钮 */
    handleSumit() {
      if (this.rowData.clmDjbh == null) {
        this.msgError("请选择需要提交的单据");
      } else {
        listckMxDet(this.rowData.clmDjbh).then((res) => {
          if (res.data.list1.length <= 0) {
            this.msgError("该单据下没有物料,无法提交");
          } else {
            submitCkMx(this.rowData.clmDjbh)
              .then((res) => {
                this.msgSuccess("提交成功~");
                this.getList();
              })
              .catch(() => {
                this.msgError("提交失败~");
              });
          }
        });
      }
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const clmIds = row.clmId || this.rowData.clmId;
      this.$confirm(
        '是否确认删除出库领料开单作业编号为"' + clmIds + '"的数据项?',
        "警告",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(function () {
          return delPicking(clmIds);
        })
        .then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    //改变原因描述状态
    changeDescriptionFlag(data) {
      if (data) {
        this.reasonDescriptionFlag = false;
      } else {
        this.reasonDescriptionFlag = true;
      }
    },
    /** 导出按钮操作 */
    // handleExport() {
    //   const queryParams = this.queryParams
    //   this.$confirm('是否确认导出所有出库领料开单作业数据项?', '警告', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning'
    //   }).then(() => {
    //     this.exportLoading = true
    //     return exportPicking(queryParams)
    //   }).then(response => {
    //     this.download(response.msg)
    //     this.exportLoading = false
    //   }).catch(() => {
    //   })
    // },
    handleExport() {
      console.log("进入到这个方法");
      //根据给的id获取table表，选取元素的时候加上，{raw:true}可以使表格正常导出，消除科学计数法
      let wb = XLSX.utils.table_to_book(document.getElementById("exportXlsx"), {
        raw: true,
      });

      let wbout = XLSX.write(wb, {
        bookType: "xlsx",
        bookSST: true,
        type: "array",
      });
      try {
        //给xlsx文件赋值名字
        FileSaver.saveAs(
          new Blob([wbout], { type: "application/octet-stream" }),
          "test.xlsx"
        );
      } catch (e) {
        if (typeof console !== "undefined") console.log(e, wbout);
      }
      console.log("走出到这个方法1");
      return wbout;
    },
    /** 单据打印 */
    handleDjDy(row, type) {
      const clmDjbh = row.clmDjbh;
      const data = { clmDjbh: clmDjbh };
      const print = () => {
        if (
          ["C", "B"].includes(row.clmType) &&
          (row.clmZtbz == 0 || row.clmZtbz == 1)
        ) {
          this.msgError("此类单据需审核完成后再进行打印！");
          return;
        }
        if (type === 2) {
          this.printData(row);
        } else {
          this.getList();
          printOrder(
            "/output/picking/exportProductPickTemplate",
            data,
            "生产领料单据"
          );
        }
      };
      if (row.clmTjflag !== "1") {
        this.$confirm("当前单据还未提交，是否提交并执行打印？", "温馨提醒", {
          confirmButtonText: "提交并打印",
          cancelButtonText: "取消",
          type: "info",
        }).then((res) => {
          if (clmDjbh) {
            listckMxDet(clmDjbh).then((res) => {
              if (res.data.list1.length <= 0) {
                this.msgError("该单据下没有物料，无法提交");
              } else {
                submitCkMx(clmDjbh)
                  .then((res) => {
                    this.msgSuccess("提交成功");
                    print();
                  })
                  .catch(() => {
                    this.msgError("提交失败");
                  });
              }
            });
          } else {
            this.msgError("无打印单据");
          }
        });
        return;
      }

      print();
    },
    printData(row) {
      this.printPage(row);
      // exportRwm(row.rwmDjbh).then((res) => {
      //   this.printPage(row)
      // })
    },
    printPage(row) {
      this.rowData = row;
      if (this.loadingChild) {
        setTimeout(() => this.printPage(row), 100);
      } else {
        this.pageData = splitArray(this.chdDetTotalList, 7);
        this.$nextTick(() => {
          this.$refs.printPage.print();
          //row.rwmDyflag++
          // this.queryParams.pageNum = 1
          // this.rwmMsrtList = []
          this.getList();
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.printPage {
  display: flex;
  justify-content: center;
  width: 24.1cm;
  .content2 {
    display: flex;
    //line-height: 28px;
    padding: 5mm 5mm 5mm 5mm;
    font-family: "等线";
    font-weight: 700;
    color: #000000;
    width: 24.1cm;
    height: 9.1cm;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
    // break-after: always;
    // break-before: always;
    // break-inside: always;
    h1 {
      font-size: 12pt;
      text-align: center;
      font-family: "等线";
      font-weight: 700;
    }
    .nowrap {
      white-space: nowrap;
      overflow: hidden;
      // display: inline-block;
    }
    .noborder {
      border: none;
    }
    table {
      margin-right: 1mm;
      border: 1px solid black;
      border-collapse: collapse;
      text-align: center;
      line-height: 20px;
      font-size: 11pt;
      color: #000000;
      table-layout: fixed;
      width: 22cm;
      thead {
        display: table-header-group;
        break-after: avoid;
        break-before: avoid;
        break-inside: avoid;
        tr,
        th,
        div,
        span,
        hr,
        h1 {
          break-after: avoid;
          break-before: avoid;
          break-inside: avoid;
        }
      }
      tfoot {
        display: table-footer-group;
        break-after: avoid;
        break-before: avoid;
        break-inside: avoid;
      }
      tbody {
        display: table-row-group;
      }
      tr {
        height: 5mm;
      }
      td,
      th {
        border: 1px solid black;
      }
    }
  }
}
</style>
